<template>
  <view class="settle-box">
    <view class="all-check">
      <label class="radio">
        <radio color="#E16531" :checked="isFullChk" @click="onFullChkChange"/><text>全选</text>
      </label>
    </view>
    <view class="total">
      合计：<text class="total-text">{{totalPrice}}</text> 
    </view>
    <view class="settlement" @click="settlement">
      结算({{chkTotal}})
    </view>
  </view>
</template>

<script>
  import {mapGetters,mapMutations,mapState} from 'vuex'
  export default {
    name:"my-settle",
    computed:{
      ...mapState('m_user',['token']),
      ...mapGetters('m_cart',['chkTotal','totalPrice','total','pickGoodsInfo']),
      ...mapGetters('m_user',['addstr']),
      isFullChk(){
        if(this.chkTotal===this.total)return true
        return false
      }
    },
    data(){
      return{
        seconds:3,
        timer:null
      }
    },
    methods:{
      ...mapMutations('m_cart',['updateFullGoodsState','clearCart']),
      ...mapMutations('m_user',['updateRedirectInfo']),
      onFullChkChange(){
        this.updateFullGoodsState(!this.isFullChk)
      },
      // 支付按钮事件
      async settlement(){
        if(!this.chkTotal) return uni.$showMsg('请选择要结算的商品！')
        if(!this.addstr) return uni.$showMsg('请选择收货地址！')
        // if(!this.token) return uni.$showMsg('请先登录！')
        if(!this.token){
          this.delayNavigate()
        }
        const x=await uni.$http.post('/api/public/v1/my/orders/create',{
          order_price:this.totalPrice,
          consignee_addr:this.addstr,
          goods:this.pickGoodsInfo
        })
        uni.showToast({
          icon:"success",
          title:"订单支付成功"
        })
        this.clearCart()
      },
      // 延迟跳转到登录页面
      delayNavigate(){
        this.seconds=3
        this.showTips(this.seconds)
        this.timer=setInterval(()=>{
          this.seconds--
          if(this.seconds<=0){
            clearInterval(this.timer)
            uni.switchTab({
              url:'/pages/my/my',
              success: () => {
                this.updateRedirectInfo({
                  openType:'switchTab',
                  from:'/pages/cart/cart'
                })
              }
            })
            return
          }
          this.showTips(this.seconds)
        },1000)
      },
      showTips(n){
        uni.showToast({
          icon:"none",
          title:"您尚未登录，在"+n+"秒后将自动跳转至登录页面！",
          mask:true,
          duration:1500
        })
      }
    }
  }
</script>

<style lang="scss">
.settle-box{
  height: 50px;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background-color: #fafafa;
  display: flex;
  justify-content: space-between;
  align-items: center;
  .all-check{
    margin-left: 5px;
  }
  .total-text{
    color: #E16531;
    font-weight: bold;
  }
  .settlement{
    background-color: #E16531;
    color: #fff;
    line-height: 50px;
    vertical-align: middle;
    width: 80px;
    text-align: center;
  }
}
</style>
